<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>《系统工程》精品资源共享课——教师课程管理</title>
	<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="../css/common.css">
	<link rel="stylesheet" type="text/css" href="../../css/bootstrap-table.css">
	<style type="text/css">
		main{
			background-color: white;
			width:70%;
			margin:30px auto 170px;
			padding-bottom:100px;
		}
		main .content{
			width:90%;
			//padding:30px 230px;
			margin:0 auto;
		}

		/*main .content .btn-groups{
			width:100%;
			margin:0 auto;
		}*/
	</style>
</head>
<body>
	<div id="top">
		<img src="../image/huanonglogo.png" class="logo">
		<ul>
			<li><a href="userInformation.html">个人信息</a></li>
			<li><span id="user"></span></li>
			<li class="logout hidden"><a href="login.html">退出</a></li>
			<li id="login" class="login"><a href="html/login.html"><img src="../image/user.png"><span>登录</span></a></li>
		</ul>
	</div>
	<nav>
		<ul class="rows">
			<li class="col-md-2 col-lg-2"><a href="../index.html">首页</a></li>
			<li class="dropdown col-md-2 col-lg-2">
				<a href="#"  data-toggle="dropdown" class="dropdown-toggle">课程概要<span class="glyphicon glyphicon-chevron-down"></span></a>
				<ul class="dropdown-menu">
					<li><a href="primaryResource.html">教学大纲</a></li>
					<li><a href="primaryResource.html">教学日历</a></li>
					<li><a href="primaryResource.html">教学教材</a></li>
					<li><a href="primaryResource.html">参考资料</a></li>
					<li><a href="primaryResource.html">重点难点</a></li>
				</ul>
			</li>
			<li class="dropdown col-md-2 col-lg-2">
				<a href="#"  data-toggle="dropdown" class="dropdown-toggle">课程资源<span class="glyphicon glyphicon-chevron-down"></span></a>
				<ul class="dropdown-menu">
					<li><a href="video.html">教学视频</a></li>
					<li><a href="ppt.html">教学课件</a></li>
					<li><a href="homework.html">作业</a></li>
				</ul>
			</li>
			<li class="col-md-2 col-lg-2"><a href="courses.html">课程内容</a></li>
			<li class="col-md-2 col-lg-2"><a href="expandingResource.html">拓展资源</a></li>
			<li class="col-md-2 col-lg-2"><a href="teacherCourseManagement.html">论坛交流</a></li>
		</ul>

	</nav>
	<main>
		<div class="content">
			<table id="section_grid"><table>
			<div id="videoTab">
				<div class="btn-groups hidden">
					<button type="button" class="btn btn-primary" onclick="add('video')" data-toggle="modal" data-target="#textModal">新增</button>
					<button type="button" class="btn btn-warning" onclick="del('video')">删除</button>
				</div>
				<table id="video_grid"></table>
			</div>
			<div id="homeworkTab">
				<div class="btn-groups hidden">
					<button type="button" class="btn btn-primary" onclick="add('homework')" data-toggle="modal" data-target="#textModal">新增</button>
					<button type="button" class="btn btn-warning" onclick="del('homework')">删除</button>
				</div>
				<table id="homework_grid"></table>
			</div>
			
		</div>
	</main>
	<div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel" aria-hidden="true">
	    <div class="modal-dialog">
	        <div class="modal-content">
	            <div class="modal-header">
	                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
	                <h4 class="modal-title" id="addModalLabel">修改个人信息</h4>
	            </div>
	            <div class="modal-body">
	            	<form role="form">
	            		<input type="text" name="id" class="form-control hidden">
						<div class="form-group">
							<label for="name">用户名</label>
							<input type="text" name="name" class="form-control required " disabled />
						</div>
						<div class="form-group">
							<label for="nickname">用户昵称</label>
							<input type="text" name="nickname" class="form-control required "/>
						</div>
						<div class="form-group">
							<label for="sex">性别</label>
							<select name="sex" class="form-control required">
								<option>男</option>
								<option>女</option>
							</select>
						</div>
						<div class="form-group">
							<label for="telphone">电话</label>
							<input type="text" name="tel" class="form-control required "/>
						</div>
						<div class="form-group">
							<label for="school">学校</label>
							<input type="text" name="school" class="form-control required "/>
						</div>		
						<div class="form-group">
							<label for="major">专业</label>
							<input type="text" name="major" class="form-control required "/>
						</div>
						<div class="form-group">
							<label for="grade">年级</label>
							<input type="text" name="grade" class="form-control required "/>
						</div>               		
	            	</form>
	            </div>
	            <div class="modal-footer">
	                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
	                <button type="button" class="btn btn-primary btn-submit" onclick="isNull()">提交</button>
	            </div>
	        </div><!-- /.modal-content -->
	    </div><!-- /.modal -->
	</div>
	<footer>
		<p>版权所有：华南农业大学 数学与信息学院 软件学院</p>
	</footer>
	<script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap.min.js"></script>
	<script type="text/javascript" src="../../js/bootstrap-table.js"></script>
	<script type="text/javascript" src="../../js/bootstrap-table-zh-CN.js"></script>
	<script type="text/javascript" src="../js/common.js"></script>
	<script type="text/javascript">
		$(function(){

		})
		function isNull(){
			$("form :input.required").each(function(){
				var obj=$(this).parent().find('.alarm');
				if($(this).val()==""){
					if(obj.length==0){
						$(this).parent().append("<b style='color:red' class='alarm'>该字段不能为空</b>");
					}
				}else{
					$(this).parent().find('.alarm').remove();
				}

			})


		}


		$("#updatePwdModal .btn-submit").click(function(event) {
			var role=sessionStorage.getItem("role");
			var id=sessionStorage.getItem("id");
			var url="",params={};
			if(role == "student"){
				url="studentController/edit";
			}else if(role == "teacher"){
				url="teacherController/edit";
			}
			var newPwd=$("form :input[name='newpasswordAgain']").val();
			params.id=id;
			params.password=newPwd;
			$("form :input.required").each(function(){
				if($(this).val()!=""){
					$.ajax({
						url: url,
			            type: 'post',
			            dataType : "json",
			            contentType : "application/json;charset=utf-8",
			            data: JSON.stringify(params),
			            success:function(data){
			              if(data==1){
			                alert("修改成功！");
			                
			              }else{
			                alert("修改失败！");
			              }
			            }
					});
				}

			})
			
			
		});

		$("#section_grid").bootstrapTable({
		  url:"/sectionController/query",
		  cache:false, 
		  striped: true, 
		    pagination: true, 
		    pageList: [10, 20],
		    pageSize: 10,
		    pageNumber: 1,
		    clickToSelect:true,
		    sidePagination: 'client',
		    sortable: true,
		    sortName: 'seSeq',
		    ortOrder: 'desc', 
		    showRefresh:true,
		    uniqueId:'seId',
		    columns: [
		          {
		              checkbox: true, 
		              align: 'center' 
		          },{
		              field: 'seId', // 要显示数据的字段名称，可以理解为json对象里的key
		              title: '章节id', // 表格表头显示文字
		              align: 'center', // 左右居中
		              valign: 'middle', // 上下居中
		              visible: false
		          },{
		              field: 'seName', 
		              title: '章节名称',
		              align: 'center',
		              width: 160, 
		              valign: 'middle'
		          }, {
		              field: 'seSeq',
		              title: '章节顺序',
		              align: 'center',
		              valign: 'middle',
		              formatter: function (value, row, index) {
		                  return '第'+value+'章';
		              }
		          }, {
		              field: 'tName',
		              title: '上课老师',
		              align: 'center',
		              width: 160, 
		              valign: 'middle'
		          }, {
		              field: 'tTel',
		              title: '电话号码',
		              align: 'center',
		              width: 160,
		              valign: 'middle'
		          }, {
		              field: 'sePpt',
		              title: 'ppt',
		              align: 'center',
		              valign: 'middle'
		          },{
		              title: "操作",
		              align: 'center',
		              valign: 'middle',
		              width: 160, 
		              formatter: function (value, row, index) {
		                  row.type="section";
		                  return '<button class="btn btn-default btn-sm" onclick="queryVideo(\'' + row.seId + '\')"><span class="glyphicon glyphicon-film"></span></button>&nbsp;'
		                  +'<button class="btn btn-default btn-sm" onclick="queryVideo(\'' + row.seId + '\')"><span class="glyphicon glyphicon-book"></span></button>&nbsp;'
		                  +'<button class="btn btn-default btn-sm" onclick="edit(\'' + row.seId + '\',\''+row.type+'\')">修改</button>';
		              }
		          }
		      ],
		      onLoadError: function(){ 
		            console.info("加载数据失败");
		      }
		});

		function queryVideo(seId){
		  $("#videoTab .btn-groups").removeClass('hidden');
		  $("#video_grid").bootstrapTable('destroy');
		  $("#video_grid").bootstrapTable({
		    url:"/videoController/query",
		    cache:false, 
		    method:'post',
		    contentType : "application/x-www-form-urlencoded",
		    striped: true, 
		      pagination: true, 
		      pageList: [5, 10],
		      pageSize: 5,
		      pageNumber: 1,
		      clickToSelect:true,
		      sidePagination: 'client',
		      sortable: true,
		      sortName: 'vId',
		      ortOrder: 'desc', 
		      showRefresh:true,
		      uniqueId:'vId',
		      queryParams: function (params) { 
		          return {
		              seId: seId// 额外添加的参数
		          }
		      }, 
		      columns: [
		            {
		                checkbox: true, 
		                align: 'center' 
		            },{
		                field: 'vId', // 要显示数据的字段名称，可以理解为json对象里的key
		                title: '视频id', // 表格表头显示文字
		                align: 'center', // 左右居中
		                valign: 'middle', // 上下居中
		                visible: false
		            },{
		                field: 'vName', 
		                title: '视频名称',
		                align: 'center',
		                width: 160, 
		                valign: 'middle'
		            },{
		                title: "操作",
		                align: 'center',
		                valign: 'middle',
		                width: 160, 
		                formatter: function (value, row, index) {
		                    row.type="video";
		                    return '<button class="btn btn-default btn-sm" onclick="edit(\'' + row.seId + '\',\''+row.type+'\')">修改</button>';
		                }
		            }
		        ],
		        onLoadError: function(){ 
		              console.info("加载数据失败");
		        }
		  });

		}

		
	</script>
</body>
</html>